<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>动态绑定事件</title>
</head>
<body>
    <script src="vue.js"></script>
    <div>
     
        <button v-on:click="doThis()">点击领取东西</button>

        <button @click="doThat($event)">点击传一个对象过去</button>

        <button @mouseover="overThis($event)" @mouseout="outThis($event)">这是传过来一个数值</button>

        <button @click='clickAragument(argument)'>点击调用data参数</button>

        <p>{{code}}</p>

       <input type="text" @keyup="keyUpClick($event)">
    </div>
    <script>
 var vue=    new Vue({
         el:'div',
         data:{
           doThis:function(){
               alert('你成功点击了按钮')
           }
           ,
           doThat:function(e){
             alert(e.target);
             console.log(e)
           }  
           ,
           overThis:function(e){
               console.log(0)
           console.log(e)
           },
           outThis:function(e){
          console.log(e)
           }
           ,
           argument:'我是参数我想去那里就去哪里'
           ,
           clickAragument:function(argument){
         console.log(argument)
           }
           ,
           code:'请按键盘'
           ,
           keyUpClick:function(e){
                  vue.code=e.keyCode;       
        }
         }
         
         
     })
    </script>
</body>
</html>